<template>
  <div>
    <a-form-model ref="ruleForm" :model="form" :rules="rules" :label-col="labelCol" :wrapper-col="wrapperCol">
          <a-form-model-item label="名称" prop="name">
            <a-input v-model="form.name" />
          </a-form-model-item>
          <a-form-model-item label="开发者类型" prop="developerType">
            <a-select v-model="form.developerType">
              <a-select-option :key="0">
                企业自有
              </a-select-option>
              <a-select-option :key="1">
                第三方企业
              </a-select-option>
              <a-select-option :key="2">
                第三方个人
              </a-select-option>
            </a-select>
          </a-form-model-item>
          <a-form-model-item label="主页" prop="host">
            <a-input v-model="form.host" />
          </a-form-model-item>
          <a-form-model-item label="状态" prop="status">
            <a-radio-group v-model="form.status">
              <a-radio :value="1">
                启用
              </a-radio>
              <a-radio :value="0">
                禁用
              </a-radio>
            </a-radio-group>
          </a-form-model-item>
          <a-form-model-item label="说明" prop="remark">
            <a-textarea v-model="form.remark" />
          </a-form-model-item>

    </a-form-model>
  </div>
</template>
<script>

import { save } from '@/api/application'
export default {
  name: 'ApplicationForm',
  data() {
    return {
      labelCol: { span: 6 },
      wrapperCol: { span: 18 },
      form: {
        id: '',
        name: '',
        developerType: 0,
        icon: '',
        host: '',
        status: 1,
        remark: ''
      },
      rules: {
        name: [
          { required: true, message: '请输入名称', trigger: 'blur' }
        ],
        host: [
          { required: true, message: '请输入主页地址', trigger: 'blur' }
        ],
        developerType: [{ required: true, message: '请选择开发者类型', trigger: 'change' }]
      }
    }
  },
  methods: {
    onSubmit() {
      this.$refs.ruleForm.validate(valid => {
        if (valid) {
          save(this.form).then(res => {
            res.success ? this.$message.success('保存成功') : this.$message.error('保存失败')
            this.$emit('done', res.success)
          }).catch(res => {
            this.$emit('done', res.success)
          })
        } else {
          this.$emit('done', false)
          return false
        }
      })
    },
    resetForm() {
      // 重置表单数据
      this.$refs.ruleForm.resetFields()
      this.$utils.merge(this.form, this.$options.data()['form'])
    },
    async loadData(data) {
      if (data.id) {
        this.$utils.merge(this.form, data)
      }
    }
  }
}
</script>
